<template>
    <div id="orderNumber">
        <!-- 订单编号 -->
        <div class="orderNumber-OrderID">
            <p>订单编号：<span>SP05621601102608622</span> </p>
            <p>创建时间：<span>2021-04-09 10:06:50</span></p>
        </div>
        <!-- 联系客服 -->
        <div class="orderNumber-service">
            <a href="#" class="orderNumber-service-text">联系客服</a>
        </div>
        <!-- 申请退款 -->
        <div class="refund">
            <van-button plain type="primary"  size="small" color="#ffa998">申请退款</van-button>
        </div>
    </div>
</template>

<script>
export default {
    
}
</script>

<style lang="less" scoped>
#orderNumber{
    // 订单编号
    background-color: #f7f7f7;
    padding-bottom: 300px;
    .orderNumber-OrderID{
        width: 100%;
        font-size: 24px;
        background-color: #ffffff;
        padding: 16px 0;
        padding-left: 26px;
        margin-top: 20px;
        color: #afafaf;
    }
    // 联系客服
    .orderNumber-service{
        height: 54px;
        line-height: 54px;
        background-color: #ffffff;
        margin-top: 20px;
        font-size: 24px;
        text-align: right;
        padding-right: 51px;
    }
    .orderNumber-service-text{
        position: relative;
        color: #6490ff;
    }
    .orderNumber-service-text::after{
        content: "";
        width: 12px;
        height: 21px;
        background: url("../../../../static/images/orderDetails/right-arrow1.png") center center;
        background-size: 100% 100%;
        position: absolute;
        display: inline-block;
        top: 50%;
        transform: translateY(-50%);
        right: -25px;
    }
    .orderNumber-service-text::before{
        content: "";
        width: 27px;
        height: 28px;
        background: url("../../../../static/images/orderDetails/service.png") center center;
        display: inline-block;
        background-size: 100% 100%;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: -40px;
    }
    // 申请退款
    .refund{
        width: 100%;
        position: fixed;
        bottom: 0;
        background-color: #ffffff;
        height: 98px;
        text-align: right;
        .van-button--primary{
            margin-right: 42px;
        }
    }
    
}
</style>